*{
    padding:0px;
    margin:0px;
}
body{
    background:#f1f1f1;
}
li{
    list-style: none;
}
a{text-decoration: none;}
header{
   position:relative;
   width:10rem; /* 375/37.5 */
   height: 1.33rem /* 50/37.5 */;
   background:orange;
   position:relative;
}
header>a:nth-of-type(1){
    width:0.3947rem;
    height:0.7467rem;
    color:#fff;
    font:0.53rem/0.7467rem "";
    text-align: center;
    position: absolute;
    left:0.4rem;
    top:0.3rem;
}
header>h1{
    position:absolute;
    left:2rem;
    top:.4rem;
    height:.576rem;
    color:#fff;
    font:.53rem/.576rem "";
    font-weight:bolder;
}
header>a:nth-of-type(2)>img{
    position:absolute;
  width:.91rem;
  height:.91rem;
    right:0.5rem;
    top:0.3rem;
}
nav{
    width: 10rem;
    height:0.933rem;
    background: #fff;
    overflow: auto;
    position: relative;
}
nav>span{
    display: block;
    width:.6rem;
    height:.93rem;
    position:fixed;
    left:0;
    top:1.33rem;
    z-index:2;
    background: #fff;
    
}
nav>ul{
height:100%;
width:24.2671rem;
position: relative;
left:0rem;
top:0rem;
overflow: hidden;
margin-left:.6rem;

}
nav>ul>li{
    float:left;
    width:1.8667rem;
    height:100%;
    text-align: center;
    font: .34667rem/.933rem "";
}
section{
    /* height:102.579rem; */
    width:100%
}
section>ul{
    /* height:102.579rem; */
    width:100%;
    margin-top:.13rem;
}
section>ul>li{
    height:4.9707rem;
    padding:.26667rem .21333rem;
    background: #fff;
    margin-bottom:.13rem;
    position:relative;
}
section>ul>li>img{
    height:3.6rem;
    width:3.47rem;
}
section>ul>li>h4{
  font:.48rem/.48rem "";
  position:absolute;
  left:3.8rem;
  top:.24rem;
  width:6rem;
  
}
section>ul>li>h4>span{
    color: orange;
}
section>ul>li>span{
    color:orange;
    font:.64rem/.64rem "";
    position:absolute;
    left:3.8rem;
    top:1.3rem
}
section>ul>li>span>i{
    font:.4267rem/.4267rem ""
}
section>ul>li>span>em{
    font:.32rem/.32rem ""
}
section>ul>li>span>del{
    font:.32rem/.32rem "";
    color:#f666;
}
section>ul>li>span>del{
    color: #666;
    
}
section>ul>li>div{
    width:6rem;
    height: 1.3173rem;
    position:absolute;
    left:3.8rem;
    top:2.4rem;
}
section>ul>li>div>i{
    width:3.1467rem !important;
    height:.5333rem;
    display: block;
    position:relative;
   background: orange;
   border-radius: .2665rem;
}
section>ul>li>div>i>em{  
    /* em就是滚动条 */
    height:0.5333rem;
    display: block;
    background: red;
    border-radius: .2665rem;  
}

section>ul>li>div>i>span{
    /* span是1% */
    position:absolute;
    top:0rem;
    left:0rem;
    color:#fff;


}
section>ul>li>div>b{
    /* b是剩余数量 */
    position:absolute;
    top:0.2rem;
   left:3.5rem;
}
section>ul>li>button{
    background: #fff;
    border: .01rem dashed orange;
   width:4rem;
    height:.67rem;
    position: absolute;
    left:3.8rem;
    top:3.8rem;
    
}
/* section>ul>li>button>a{
    position:absolute;
    z-index:-1
} */
section>ul>li>input{
    width:2.13rem;
    height:.8rem;
    background: red;
    color:#fff;
    border-radius: .2rem;
    border: 0rem;
    outline: 0rem;
    position:absolute;
    left:7.8rem;
    top:4.5rem;
}
footer{
    height:5.952rem;
    background: #f1f1f1;
    position: relative;
}
footer>button:nth-of-type(1){
    width:9.472rem;
    background: #fff;
    margin:0.2667rem;
    height:0.843rem;
    border:0rem;
}
footer>div{
    height:0.917rem;
    background:orange;
    margin-top: 0.2667rem;
    position:relative;
}
footer>div>span{
    color:#fff;
    line-height: 0.917rem;
    font:.53rem/.92rem "";
    margin-left:.2rem
}
footer>div>a>img{
    width:.53rem;
    height:.53rem;
    position:absolute;
    right:.3rem;
    top:.2rem;
}
footer>ul{
margin-top: .4rem;;
}
footer>ul>li{
    float:left;
    list-style: none;
    width:33.333%;
    text-align:center;
    border:0.02667rem solid #ccc;
    box-sizing: border-box;
    height: .88rem;
  
}
footer>ul>li>a{
    color:#000;
    font:.4rem/.88rem "";
    
}
footer>h1{
    height:.448rem;
    font:0.3467rem/0.448rem "";
    text-align: center;
    position: absolute;
    bottom:1.3rem;
    left:1.5rem;
}
footer>h2{
    height:.448rem;
    font:0.3rem/0.448rem "";
    text-align: center;
    position:absolute;
    bottom:.65rem;
    left:3.2rem;
}